{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>登录</title>
    <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
    <link href="{% static 'css/signin.css' %}" rel="stylesheet">
</head>

<body class="text-center">

    <div class="form-signin">
        <img class="mb-4" src="{% static 'img/zzu.svg'%}" alt="" width="300" height="250">
        <input type="text" id="username" name="username" class="form-control" placeholder="用户名" required="" autofocus="">
        <br>
        <input type="password" id="password" name="password" class="form-control" placeholder="密码" required="">
        <div style="margin-top: 30px">
            <button style="width: 60%; border: none; background-color: dodgerblue; color: white; font-size: 16px;
                 box-sizing: content-box; padding: 10px; cursor: pointer" onclick="login()">
                登录
            </button>
            <p class="mt-5 mb-3 text-muted">© 2022-10-29</p>
        </div>
    </div>


    <script src="{% static "js/jquery.min.js" %}"></script>
    <script type="text/javascript">
        function login() {
            $.ajax({
                type: "POST",
                url: "/user/login/",
                data:{'username':$("#username").val(), 'password':$("#password").val()},
                success: (res) => {
                    if (res.code) {
                        alert("欢迎使用！")
                        location.href = "/depart/list";
                    } else {
                        alert("账号或密码错误!")
                    }
                }
            })
        }
    </script>
</body>
</html>

